<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-
		scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="tephone=no,email=no,date=no,address=no">
	<link rel="stylesheet" type="text/css" href="../css/aui.css" />
	<link rel="stylesheet" type="text/css" href="../css/aui-slide.css" />
	<style type="text/css">
		.preview-title {
			position: absolute;
			left: 0.6 rem;
			bottom: 0.2 rem;
			color: #FFFFFF;
			font-weight: lighter;
		}
		/*.aui-title img {
			 height: 2rem;
			 margin-left: 2rem;
			 margin-top: 0.12 rem;
			 }
			 .aui-slide-node img {
			 width: 100%;
			 height: auto;
			 }
			 #aui-slide3 {
			 margin-top:2.25rem;
			 }
			 .preview-title {
			 position: absolute;
			 left: 0.6 rem;
			 bottom: 0.2 rem;
			 color: #FFFFFF;
			 font-weight: lighter;
			 }
			 #seclist .aui-card-list:last-child {
			 margin-bottom: 0;
			 }
			 .zb-title {
			 position: absolute;
			 left: 0.6 rem;
			 color: #FFFFFF;
			 font-weight: bold;
			 }
			 .aui-label-outlined {
			 color: #ffffff;
			 }*/
		/*.aui-card-list{
			 margin-bottom:0.1 rem;
			 }*/
	</style>
</head>

<body>
	<div id="content">
		<section class="aui-content">
			<div class="aui-card-list aui-border-t aui-border-b" v-on:click="openWin(item.id,item.liveType,item.pullStreamUrl)" v-for="item in live_list">
				<div class="aui-card-list-content">
					<img :src="item.coverImg" />
				</div>
				<div class="aui-card-list-header aui-padded-t-5 aui-padded-b-5">
					{{item.title}}
				</div>
				<div class="aui-card-list-content-padded aui-padded-t-0 aui-padded-b-0" style="color:#7b7b7b;">
					{{item.summary}}
				</div>
				<div class="aui-card-list-footer aui-font-size-12" style="color:#999;">
					<div>
						<span>{{item.viewQty}}围观</span> - <span>{{item.status}}</span>
					</div>
				</div>
			</div>
		</section>
	</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/vue.min.js"></script>
<script type="text/javascript" src="../script/aui-slide.js"></script>
<script type="text/javascript">
	var pageIndex = 1;
	var vm;
	apiready = function () {
		api.showProgress({
			title: '努力加载中...',
		});
		vm = new Vue({
			el: '#content',
			data: {
				live_notice_list: [],
				live_list: []
			},
			ready: function () {
				$api.get('http://mu.biachina.com/api/live/list?pageIndex=' + pageIndex.toString(), function (ret) {
					vm.live_list.push.apply(vm.live_list, ret.list);
					console.log(vm.live_list.length);
					api.hideProgress();
				}, 'json');
			},
			methods: {
				openWin: function (id, liveType, pullStreamUrl) {
					var delay = 0;
					if (api.systemType != 'ios') {
						delay = 300;
					}
					api.openWin({
						name: 'live',
						url: 'live_win.html',
						bounces: false,
						delay: delay,
						slidBackEnabled: true,
						vScrollBarEnabled: false,
						pageParam: {
							id: id,
							liveType: liveType,
							pullStreamUrl: pullStreamUrl
						}
					});
				}
			}
		});
	}

</script>

</html>